<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<html>
<head>
<meta charset="GB18030">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet"
	href="${pageContext.request.contextPath}/static/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/static/css/font-awesome.min.css">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/static/css/main.css">
	<link rel="stylesheet" href="${pageContext.request.contextPath}/static/ztree/zTreeStyle.css">
</head>
<body style="margin-top: -50px">
	<div class="panel panel-default" style="margin-top: 0px; width: 700px;">
		<div class="panel-heading">
			<h3 class="panel-title">
				<i class="glyphicon glyphicon-th"></i> 到期提醒
			</h3>
		</div>
		<div class="panel-body">
			<input type="text" id="pn" value="1" hidden/>
			<div class="table-responsive">
				<table class="table  table-bordered">
					<thead>
						<tr>
							<th width="30">#</th>
							<th>车牌号码</th>
							<th>到期时间</th>
							<th>提醒类别</th>
						</tr>
					</thead>
					<!-- 信息展示 -->
					<tbody id="tb1">
					</tbody>
				</table>
			</div>
			<!-- 分页信息 -->
			<div class="row" id="page_div"></div>
		</div>
		
		<script
			src="${pageContext.request.contextPath}/static/jquery/jquery-2.1.1.min.js"></script>
		<script
			src="${pageContext.request.contextPath}/static/bootstrap/js/bootstrap.min.js"></script>
		<script
			src="${pageContext.request.contextPath}/static/script/docs.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/ztree/jquery.ztree.all-3.5.min.js"></script>	
		<script type="text/javascript">
			$(function() {
				load();
			})
		</script>
		<script type="text/javascript">
			function load() {
				var pn=$("#pn").val();
				$.ajax({
							url : "${pageContext.request.contextPath}/endRemind/getContent",
							type : "post",
							data : {
								"pn" : pn
							},
							dataType : "json",
							success : function(data) {
								var list = data.list;
								var trStr = "";
								for (var i = 0; i < list.length; i++) {
									trStr = trStr + "<tr>";
									trStr = trStr + "<td>" + (i + 1) + "</td>";
									trStr = trStr + "<td>" + list[i].carlicense
											+ "</td>";
									trStr = trStr + "<td>" + list[i].endtime
											+ "</td>";
									trStr = trStr + "<td>" + list[i].remindtype
											+ "</td>";
									trStr = trStr + "</tr>";		
								}
								$("#tb1").html(trStr);
								var divStr = "";
								divStr = divStr + "<div align='center'>";
								divStr = divStr + "<ul class='pagination'>";
								divStr = divStr
										+ "<li><a href='javascript:changePage(1)'>首页</a></li>";
								divStr = divStr + "<li>";
								if (data.hasPreviousPage) {
									divStr = divStr
											+ "<a href='javascript:changePage(-1)' aria-label='Previous'> <span aria-hidden='true'>«</span></a>";
								}
								divStr = divStr + "</li>";
								var navigatepageNums = data.navigatepageNums;
								for (var i = 0; i < navigatepageNums.length; i++) {
									if (navigatepageNums[i] == data.pageNum) {
										divStr = divStr
												+ "<li class='active'><a href='#'>"
												+ navigatepageNums[i]
												+ "</a></li>";
									}
									if (navigatepageNums[i] != data.pageNum) {
										divStr = divStr
												+ "<li><a href='javascript:changePage("
												+ navigatepageNums[i] + ")'>"
												+ navigatepageNums[i]
												+ "</a></li>";
									}
								}
								divStr = divStr + "<li>";
								if (data.hasNextPage) {
									divStr = divStr
											+ "<a href='javascript:changePage(-2)' aria-label='Next'> <span aria-hidden='true'>»</span> </a>";
								}
								divStr = divStr + "</li>";

								divStr = divStr
										+ "<li><a href='javascript:changePage("
										+ data.pages + ")'>尾页</a></li>";
								divStr = divStr + "</ul>";
								divStr = divStr + "</div>";
								divStr = divStr + "<div align='center'>当前第 "
										+ data.pageNum + " 页.总共 " + data.pages
										+ " 页.一共 " + data.total + " 条记录</div>";
								$("#page_div").html(divStr);
							}
						});
			}

			//翻页
			function changePage(page) {
				var pn = $("#pn").val();
				if (page == -1) {
					$("#pn").val(pn - 1);
				} else if (page == -2) {
					var pn1 = parseInt(pn);
					$("#pn").val(pn1 + 1);
				} else {
					$("#pn").val(page);
				}
				load();
			}
			
		</script>
</body>
</html>